<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>layui</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all" />
		<link rel="stylesheet" href="__CSS__/admin.css" media="all">
		<style type="text/css">
			/* tooltip */
			
			#tooltip {
				position: absolute;
				border: 1px solid #ccc;
				background: #333;
				padding: 2px;
				display: none;
				color: #fff;
			}
			
			.layui-btn-danger {
				background-color: #2BB6F6;
			}
			
			.layui-col-xs6 {
				width: 10%;
			}
			
			.layadmin-carousel {
				height: 100px!important;
			}
			
			.layadmin-carousel .layui-carousel,
			.layadmin-carousel>[carousel-item]>* {
				background-color: #fff;
			}
			
			.layadmin-carousel .layui-col-space10 {
				margin: 0;
			}
			
			.layadmin-backlog .layadmin-backlog-body {
				display: block;
				padding: 10px 15px;
				background-color: #f8f8f8;
				color: #999;
				border-radius: 2px;
				transition: all .3s;
				-webkit-transition: all .3s;
			}
			
			.layadmin-backlog-body h3 {
				padding-bottom: 10px;
				font-size: 12px;
			}
		</style>
	</head>

	<body style="padding:10px;">
		<div class="tplay-body-div">
			<div class="layui-tab">
				<ul class="layui-tab-title">
					<li class="layui-this">会员列表</li>
				</ul>
			</div>

			<div class="layui-carousel layadmin-carousel layadmin-backlog" lay-anim="" lay-indicator="inside" lay-arrow="none">
				<div carousel-item="">
					<ul class="layui-row layui-col-space10 layui-this">
						<li class="layui-col-xs6">
							<a lay-href="" class="layadmin-backlog-body">
								<h3>本日新增会员数</h3>
								<p><cite>{$count}</cite></p>
							</a>
						</li>
						<li class="layui-col-xs6">
							<a lay-href="" class="layadmin-backlog-body">
								<h3>会员总数</h3>
								<p><cite>{$total}</cite></p>
							</a>
						</li>
						<li class="layui-col-xs6">
							<a lay-href="" class="layadmin-backlog-body">
								<h3>已激活会员</h3>
								<p><cite>{$yjh}</cite></p>
							</a>
						</li>
						<li class="layui-col-xs6">
							<a lay-href="" class="layadmin-backlog-body">
								<h3>待激活会员</h3>
								<p><cite>{$djh}</cite></p>
							</a>
						</li>
					</ul>
				</div>
				<button class="layui-icon layui-carousel-arrow" lay-type="sub"></button><button class="layui-icon layui-carousel-arrow" lay-type="add"></button></div>

			<form class="layui-form serch" action="{:url('admin/member/memlist')}" method="post">
				<div class="layui-form-item" style="float: left;">
					<div class="layui-input-inline">
						<div class="layui-inline">
							<div class="layui-input-inline">
								<input autocomplete="off" type="text" class="layui-input" id="create_time" placeholder="开卡开始时间" name="start_time" value="{$start_time}">
							</div>
						</div>
					</div>
					<div class="layui-input-inline" style="width: 10px;">
						<fieldset class="layui-elem-field layui-field-title"></fieldset>
					</div>
					<div class="layui-input-inline">
						<div class="layui-inline">
							<div class="layui-input-inline">
								<input type="text" autocomplete="off" class="layui-input" id="end_time" placeholder="开卡结束时间" name="end_time" value="{$end_time}">
							</div>
						</div>
					</div>
					<div class="layui-input-inline">
						<input type="text" name="keywords" value="{$keywords}" lay-verify="title" autocomplete="off" placeholder="会员卡/手机号" class="layui-input layui-btn-sm">
					</div>
					<div class="layui-input-inline">
						<div class="layui-inline">
							<select name="is_status" lay-search="">
								<option value="">全部</option>
								<option value="1" {if condition="$is_status eq 1" }selected{/if}>已激活</option>
								<option value="2" {if condition="$is_status eq 2" }selected{/if}>未激活</option>
							</select>
						</div>
					</div>
					<button class="layui-btn layui-btn-danger layui-btn-sm" lay-submit="" lay-filter="serch">查询</button>
				</div>
			</form>
			<table class="layui-table" lay-size="sm">
				<colgroup>
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
					<col width="100">
				</colgroup>
				<thead>
					<tr>
						<th>会员卡号</th>
						<th>会员姓名</th>
						<th>会员电话</th>
						<th>会员级别</th>
						<th>余额（元）</th>
						<th>房券</th>
						<th>开卡时间</th>
						<th>会员状态</th>
						<th>注册时间</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					{volist name="list" id="vo"}
					<tr>
						<td>{$vo.card}</td>
						<td>{$vo.user_name}</td>
						<td>{$vo.mobile}</td>
						<td>{$vo.name}</td>
						<td>{$vo.balance}</td>
						<td style="color: #2BB6F6;cursor:pointer;" onclick="fq_info({$vo.id})">{$vo.kaquan}</td>
						<td>{$vo.start_time}-{$vo.end_time}</td>
						<td>
							<form class="layui-form" action="" lay-filter="example">  
							    <input type="checkbox" {if $vo.is_status==1 }checked{/if} data-id="{$vo.id}" lay-skin="switch" lay-filter="status" lay-text="激活|冻结">
							</form>
						</td>
						<td>{$vo.add_time}</td>
						<td class="operation-menu">
							<a href="{:url('admin/member/memedit',['id'=>$vo.id])}" style="font-size:12px;color: #2BB6F6;">设置</a>
							<a href="{:url('admin/member/meminfo',['id'=>$vo.id])}" style="font-size:12px;color: #2BB6F6;">详情</a>
						</td>
					</tr>
					{/volist}
				</tbody>
			</table>
			<div style="padding:0 20px;">{$list->render()}</div>

			{include file="public/foot"}
            <script>
            	layui.use(['form', 'layedit', 'laydate'], function() {
					var form = layui.form;
			        var jquery = layui.jquery;
			        var layer = layui.layer;
			        
			        //会员状态
					form.on('switch(status)', function(data) { 
						var checked = this.checked;
						var flag = 1; //1开启  0关闭
						var uid = $(this).attr('data-id'); //id 
						var msg = "确定要激活吗";
						if(checked == false) {
							flag = 2;
							msg = "确定要冻结吗";
						}
						
						layer.confirm(msg, {
							btn: ['确定', '取消'] //按钮
						}, function() {
							user_status(flag,uid);
						});
					});
            	})
            	
            	function user_status(is_status,uid){  
    		    	$.ajax({
						type: 'post',
						url: "{:url('member/user_status')}",
						dataType: 'json',
						data: {
							uid: uid,
							is_status: is_status
						},
						success: function(data) { 
							layer.msg(data.msg, {
								icon: 1,
								time: 1000
							}); 
						}
					});
            	}
            	function fq_info(uid){
					var url = "{:url('member/fq_info')}?uid=" + uid;
					layer.open({
					  type: 2,
					  title: '房券详情',
					  shadeClose: true, 
					  area: ['700px', '700px'],
					  content: [url]
					}); 
				} 
			    
                layui.use('laydate', function(){
			        var laydate = layui.laydate;
			      
				    //常规用法
				    laydate.render({
				        elem: '#end_time'
				    });
			    });
            </script>
		</div>
	</body>

</html>